<script lang="ts">
import { defineComponent } from 'vue'
import { Info } from '@icon-park/vue-next'

export default defineComponent({
  name: 'about',
  components: { Info },
  data() {
    return {
      show: false
    }
  }
})
</script>

<template>
  <el-button @click="show=true" link>
    <info theme="filled" size="16" />
  </el-button>
  <el-dialog :model-value="show" :title="'关于'" @close="show = false" :width="500" :lock-scroll="false">
    <div class="about">
      <icon-crrc style="width: 3em"></icon-crrc>
      <div>Electron Sqlite Demo</div>
      <div>mammoth_work@163.com</div>
    </div>
  </el-dialog>
</template>

<style scoped lang="less">
.about {
  text-align: center;

  * {
    margin-bottom: 10px;
  }
}
</style>
